<template>
	<el-dialog :title="form.modelName" v-model="open" width="800px" @open="initOpen" append-to-body :before-close="close"
		@close="close">
		<!-- <p class="dialogTitle">{{form.modelName}}</p> -->
		<el-form ref="ResettlementRef" :model="form" label-width="120px">
			<el-row>
				<el-col :span="12">
					<el-form-item label="模型名称" prop="modelName">
						{{form.modelName}}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="是否默认" prop="">
						{{form.isDefault=='0'?'否':'是'}}
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="24">
					<el-form-item label="地区" prop="">
						{{form.range}}
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="12">
					<el-form-item label="维护人" prop="">
						{{form.createUserName}}
					</el-form-item>
				</el-col>
				<el-col :span="12">
					<el-form-item label="维护人单位" prop="">
						{{form.orgName}}
					</el-form-item>
				</el-col>
			</el-row>
			<el-row>
				<el-col :span="6" class="tab-title">
					{{form.modelName}}
				</el-col>
			</el-row>
			<el-divider border-style="dashed"></el-divider>
			<el-row>
				<el-col :span="20" :offset="2">
					<div style="margin-top:10px;line-height: 30px;">
						<p style="text-indent: 2em;">根据房屋倒塌和损坏计算需转移安置人数，对于地震评估区需紧急安置人数的计算，采用国家标准《地震现场工作第4部分：灾害直接损失评估》（GB/T
							18208.4-2011）</p>
						<p style="text-indent: 2em;">式中，a为户均居住面积，b为户均人口，c
							为所有住宅房屋的毁坏面积，d为非简易房屋的严重破坏面积，e为非简易房屋中等破坏面积与简易房屋破坏面积之和，f为死亡人数。</p>
						<el-row justify="center">
							<el-col :span="8">
								<p style="font-size: 16px;font-weight: bold;font-style: italic;position:relative">
									T =
									<span
										style="position: absolute;top: -15px;bottom: 15px;left: 30px;border-bottom: 2px solid;">c+d+e/2</span>
									<span style="position: absolute;top: 22px;top: 15px;left: 52px;">a</span>
									<span style="position: absolute;left: 95px;">×</span>
									<span style="position: absolute;left: 110px;">b-f</span>
								</p>
							</el-col>
						</el-row>
					</div>
				</el-col>
			</el-row>
		</el-form>
		<template #footer>
			<div class="dialog-footer">
				<el-button type="primary" @click="close">关闭</el-button>
			</div>
		</template>
	</el-dialog>
</template>
<script setup>
import { getResettlementModelById } from '@/api/earthquakeLossesEstimation/earthquakeSetting'

const props = defineProps({
	open: Boolean,
	id: {
		type: String,
		default: ''
	}
})
const emits = defineEmits(['update:open'])
const data = reactive({
	form: {
		modelName: '需紧急安置人数默认模型',
		isDefault: '1',
		createUserName: '系统默认',
		orgName: '系统默认',
		// updateTime: '2022-11-08',
		// createTime: '2022-11-08',
		range: '需满足人口普查数据、人口和建筑'
	}
})
const { form } = toRefs(data)
// 查询模型详情
const getModelDetail = () => {
	getResettlementModelById(props.id).then(res => {
		if (res.code == 200) {
			res.data && (form.value = res.data)
		}
	})
}

const initOpen = () => {
	// getModelDetail()
}
const close = () => {
	emits('update:open', false)
}
</script>
<style scoped lang="scss">
.el-form {
	padding-top: 20px;
	.el-form-item {
		margin-bottom: 0;
	}
}

.tab-title {
	font-size: 16px;
	font-weight: bold;
	border-left: 4px solid var(--el-color-primary);
	font-family: PingFangSC-Medium;
	padding-left: 10px;
	margin: 10px 0;
}

#lineTd {
	background: #fff url() no-repeat 100% center;
}

table td {
	border: 1px solid #c6c6c6;
}
</style>